<template>
	<view>
		<view class="appinfo">
			<image src="/static/image/appicon.png" mode="aspectFill"></image>
			<view class="appname">天天有礼</view>
			<view class="desc">天天好礼免费送 天天都有新惊喜</view>
		</view>
		<view class="navbar">
			<view class="navitem">
				<text>当前版本</text>
				<view class="version">
					<text>v{{version}}</text>
					<text class="iconfont">&#xe616;</text>
				</view>
			</view>
			
			<navigator url="/pages/webview/webview?url=https://recharge.607068.com/down/userAgreement" class="navitem">
				<text>服务协议</text>
				<view class="iconfont">&#xe616;</view>
			</navigator>
			
			<navigator url="/pages/webview/webview?url=https://recharge.607068.com/down/privacyAgreement" class="navitem">
				<text>隐藏政策</text>
				<view class="iconfont">&#xe616;</view>
			</navigator>
			
			<view class="navitem" @click="contactvisible=true">
				<text>联系客服</text>
				<view class="iconfont">&#xe616;</view>
			</view>
			
			<!--联系客服-->
			<alert modeltitle="联系客服" :visible="contactvisible">
				<view class="contactus">
					<view class="coop-text">
						<text>1、客服热线：0797 822 2955</text>
						<text>2、客服微信号：{{wechat}}</text>
						<text>3、联系邮箱：gzweixu@sina.com</text>
					</view>
					<view class="coop-button">
						<view class="cancel" @tap="contactvisible=false">取消</view>
						<view class="copywechat" @click="copywechats">一键复制微信号</view>
					</view>
				</view>
			</alert>
			
		</view>
		<view class="copyright">
			<text class="smallcopy">copyright© 2020-2021 赣州微旭科技. All Rights Reserved</text>
		</view>
	</view>
</template>

<script>
 export default{
	 data(){
		 return{
			contactvisible:false,
			wechat: 'TianTianYouLi888',
			version:plus.runtime.version,
		 }
	 },
	 onLoad() {
	 	uni.$on("closewindown", (option) => {
	 		this.contactvisible = option;
	 	})
	 },
	 methods:{
		 copywechats() {
		 	uni.setClipboardData({
		 		data: this.wechat,
		 		success() {
		 			console.log('success');
		 		}
		 	})
		 }
	 }
 }
</script>

<style lang="scss">
	.contactus {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		font-size: 28rpx;
		flex: 1;
	
		.coop-text {
			flex: 1;
			display: flex;
			justify-content: center;
			align-items: flex-start;
			flex-direction: column;
	
			text {
				margin: 10rpx 0;
			}
	
			.zhuyi {
				margin-top: 40rpx;
				color: #8b8b8b;
			}
		}
	
		.coop-button {
			width: 100%;
			display: flex;
			flex: 1;
			align-items: center;
			justify-content: space-around;
			margin: 20rpx 0;
	
			.cancel {
				display: flex;
	
				align-items: center;
				justify-content: center;
				width: 170rpx;
				height: 75rpx;
				background-color: #e6e6e6;
				color: #808080;
				border-radius: 30rpx;
			}
	
			.copywechat {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 240rpx;
				height: 75rpx;
				background-color: $uni-color-primary;
				border-radius: 30rpx;
				color: #fff;
			}
		}
	
	}
	
	.copyright {
		font-size: 28rpx;
		position: absolute;
		bottom: 50rpx;
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		.smallcopy {
			color: #b0b0b0;
			font-size: 22rpx;
		}
	}
	.appinfo{
		width: 100%;
		height: 300rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		border-bottom :30rpx solid #f0f0f0;
		flex-direction: column;
		padding: 100rpx 0;
	
		image{
			width: 200rpx;
			height: 170rpx;
			// border: 1rpx solid #F8F8F8;
			// border-radius: 30rpx;
			
		}
		.appname{
			font-size: 40rpx;
			font-weight: bold;
			margin-top: 15rpx;
			margin-bottom: 30rpx;
			color: $uni-color-primary;
		}
		.desc{
			font-size: 25rpx;
			color: #a1a1a1;
		}
	}
	.navbar{
		display: flex;
		justify-content: center;
		align-items: center;
		color: #333;
		flex-direction: column;
		.navitem{
			border-bottom: 1rpx solid #f4f4f4;
			width: 90%;
			height: 100rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			font-size: 28rpx;
			.version{
				color: #9b9b9b;
				display: flex;
				justify-content: center;
				align-items: center;
			
			}
			.iconfont{
				color: #9b9b9b;
				font-size: 30rpx;
				margin-left: 5rpx;
			} 
			.goto{
				
			}
		}
	}
</style>
